<?php 
if(!isset($_SESSION)) 
{ 
session_start(); 
} 
$userid = $_SESSION['iduser'];
$monitor = $_REQUEST['monitor'];
$monitorname = $_REQUEST['monitorname'];

include '../connection/connection.php';
include "../value/value_kr.php";
?>

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="x-ua-compatible" content="IE=edge"/>
<link href="../css/style.css" rel="stylesheet" type="text/css" />
<link href="../popup-window.css" rel="stylesheet" type="text/css"/>
<script type="text/javascript" src="../js/jquery.js"></script>
<script type="text/javascript" src="../popup-window.js"></script>

<link rel="stylesheet" href="../css/jquery-ui.css" />
<script type="text/javascript" src="../js/jquery-ui.js"></script>
<script type="text/javascript">
 $(function() {
	 var checkexistus = '<?=$userid?>';
	if(checkexistus==''){
		admin_logout();
		}
 });
</script>
<style>
.ui-widget-content{
	border:1px solid #4A4A4A;
}	
.ui-spinner-input{
	margin: 0px 20px 0px 4px;
}

</style>
<script type="text/javascript">
$(document).ready(function(){
	ScrollTable();
	
});
function MyResize(){
	ScrollTable();
}

function ScrollTable(){
	wid = $("table#tablebody").parent().css('width');
	wid = wid.slice(0,-2)-20;
	$("table#tablebody").css("width", wid);
	$("table#tablebody2").css("width", wid);
	$('table#tablebody').parent().scrollTop(0);
}

function OnTRCSS(){
	$("table.tbchung1 tr:even").each(function(){
		$(this).css("background-color","#eff3fa");
	});
}
function MyResizeLeft(){
	ScrollTableLeft();
}

function ScrollTableLeft(){
	wid = $("table#tablebodyleft").parent().css('width');
	wid = wid.slice(0,-2)-16;
	$("table#tablebodyleft").css("width", wid);
	$("table#tablebody2left").css("width", wid);
	$('table#tablebodyleft').parent().scrollTop(0);
	OnTRCSSLeft();
}

function OnTRCSSLeft(){
	$("table.tbchung tr:even").each(function(){
		$(this).css("background-color","#eff3fa");
	});
}
</script>
<script type="text/javascript">
function loadCameraById(){
  var winH = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;
  var monitorid = document.getElementById('monitorid').value;
  $.ajax({ type: "GET",url:"load-camera-by-monitor.php?monitorid=" + monitorid+"&winH="+winH,success: function(result) {
	    document.getElementById("dvcontentleft").innerHTML=result;
	    document.getElementById('newmonitor').setAttribute("class", "inbtnDisable");
	    document.getElementById('newmonitor').className = "inbtnDisable";
	    document.getElementById('newmonitor').disabled  = true;
	    ScrollTableLeft();
	  }
	  });
}

function checkSelectAll(){
	if($("#checkall").is(':checked')){
		$('.checkCamera:checkbox').attr('checked',true);
	}else{
		$('.checkCamera:checkbox').attr('checked',false);
	}
}
function onclickrecordcheck(id){
var gt=document.getElementById(""+id).checked;
	document.getElementById(id).checked = !gt;
}
function popuploadbel(ele){
	var popID = $(ele).attr('rel'); //Get Popup Name
    var popURL = $(ele).attr('href'); //Get Popup href to define size
                    
    //Pull Query & Variables from href URL
    var query= popURL.split('?');
    var dim= query[1].split('&');
    var popWidth = dim[0].split('=')[1]; //Gets the first query string value

    //Fade in the Popup and add close button
    $('#' + popID).fadeIn().css({ 'width': Number( popWidth ) }).prepend('<a href="#" class="close"><span class="btn_close">X</span></a>');
    
    //Define margin for center alignment (vertical + horizontal) - we add 80 to the height/width to accomodate for the padding + border width defined in the css
    var popMargTop = ($('#' + popID).height() + 80) / 2;
    var popMargLeft = ($('#' + popID).width() + 80) / 2;
    
    //Apply Margin to Popup
    $('#' + popID).css({ 
            'margin-top' : -popMargTop,
            'margin-left' : -popMargLeft
    });
    
    //Fade in Background
    $('body').append('<div id="fade"></div>'); //Add the fade layer to bottom of the body tag.
    $('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn(); //Fade in the fade layer 
    $('a.close, #fade, .iclose').live('click', function() { //When clicking on the close or fade layer...
        $('#fade , .popup_block').fadeOut(function() {
              $('#fade, a.close').remove();  
	}); //fade them both out
	      
	      return false;
	});
}
// function edit monitor
function loadEditMonitor_Popup(txtno,idcamera,cameraname,position,els){
	popuploadbel(els);
	document.getElementById("txtno").value=txtno;
	document.getElementById("txtcameraid").value=idcamera;
	document.getElementById("txtcameraname").value=cameraname;
	document.getElementById("txtposition").value=position;
	//document.getElementById("pagehidden").value=page;
}
function processSaveEditMonitor_Popup(){
	var winH = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;
	var idcamera = document.getElementById("txtcameraid").value;
	var position = document.getElementById("txtposition").value;
	var monitorid = document.getElementById('monitorid').value;
	//var page = document.getElementById("pagehidden").value;
	if(position.length==0){
		alert('Please input position');
		return false;
	}
	if(position > 64){
		alert('Please input interger less than 65');
		return false;
	}
	$.ajax({url:"process-update-camera-popup.php?idcamera=" + idcamera + "&position=" + position+"&monitorid=" + monitorid+"&winH="+winH,success : function(result){
		 document.getElementById("table_mo_camera_left").innerHTML=result;
		 ScrollTableLeft();
		 $('#fade , .popup_block').fadeOut(function() {
             $('#fade, a.close').remove();  
	}); 
		}
	});
}
function validate(evt)
{
	 if(evt.keyCode!=8)
	 {
		 var theEvent = evt || window.event;
		 var key = theEvent.keyCode || theEvent.which;
		 key = String.fromCharCode( key );
		 var regex = /[0-9]|\./;
	 if( !regex.test(key) ){
	   theEvent.returnValue = false;
	   if(theEvent.preventDefault) theEvent.preventDefault();
	 }
	 }
}
function processdeleteCamera(idmonitor){
	var winH = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;
	   var elements = document.getElementById("mpform").elements;
	   var ids = new Array(); 
	   for(var i=0; i< elements.length;i++){
	      if(elements[i].type == 'checkbox' && elements[i].checked){
		      ids[i] = elements[i].value;
		    //  alert('id camera = ' + ids[i] + " == idmonitor " + idmonitor);
	 		//	document.getElementById("pagehidden").value=page;
		 	 $.ajax({url:"process-delete-camera-table.php?idcamera="+ids+"&idmonitor="+idmonitor+"&winH="+winH,success:function(result){
			 	 //alert('result = ' + result);
				 document.getElementById("table_mo_camera_left").innerHTML=result;
				 ScrollTableLeft();
		 	}
			});
	      }else{
	    	  $('#checkall').attr('checked', false);
		      }
	}
}

function reset_1_Monitor(){
	document.getElementById('monitorname').value="";
	document.getElementById('monitorpos').value="";
	document.getElementById('optionPos').value="";
	document.getElementById('timeout').value="";
//	document.getElementById('monitorid').disabled = true;
	document.getElementById('newmonitor').setAttribute("class", "inbtn");
	document.getElementById('newmonitor').className = "inbtn";
	document.getElementById('newmonitor').disabled = false;
	
	document.getElementById('editmonitor').setAttribute("class","inbtnDisable");
	document.getElementById('editmonitor').className = "inbtnDisable";
	
	document.getElementById('deletemonitor').setAttribute("class","inbtnDisable");
	document.getElementById('deletemonitor').className = "inbtnDisable";
	
	document.getElementById('resetmonitor').setAttribute("class","inbtn");
	document.getElementById('resetmonitor').className = "inbtn";

	document.getElementById('editmonitor').disabled  = true;
	document.getElementById('deletemonitor').disabled  = true;
}
function edit_monitor(){
	var monitorid = document.getElementById('monitorid').value;
	var monitorname = document.getElementById('monitorname').value;
	var monitorpos = document.getElementById('monitorpos').value;
	var timeout = document.getElementById('timeout').value;
	var optionPos = document.getElementById('optionPos').value;
	var host = document.getElementById('txthost').value;
	
	$.ajax({url:"edit-monitor.php?monitorid="+monitorid+"&monitorname="+monitorname+"&monitorpos="+monitorpos+"&timeout="+timeout+"&optionPos="+optionPos+"&host="+host,success:function(result){
		 document.getElementById("dvcontentleft").innerHTML=result;
		    document.getElementById('newmonitor').setAttribute("class", "inbtnDisable");
		    document.getElementById('newmonitor').className = "inbtnDisable";
		    loadCameraById();
		    alert('<?=$l_alerteditsuccessful?>');
		}
	});
}
function delete_monitor(){
	var monitorid = document.getElementById('monitorid').value;
	 $.ajax({ type: "GET",url:"delete-monitor.php?monitorid=" + monitorid,success: function(result) {
		    document.getElementById("dvcontentleft").innerHTML=result;
		    document.getElementById('newmonitor').setAttribute("class", "inbtnDisable");
		    document.getElementById('newmonitor').className = "inbtnDisable";
		    loadCameraById();
		    alert("<?=$l_alertdeletesuccessful?>");
		  }
		  });
}
function create_monitor(){
	var monitorname = document.getElementById('monitorname').value;
	var monitorpos = document.getElementById('monitorpos').value;
	var timeout = document.getElementById('timeout').value;
	var optionPos = document.getElementById('optionPos').value;
	var host = document.getElementById('txthost').value;

	if(monitorname.length==''){
		alert("You must input data");
		return false;
	}else{
		$.ajax({url:"create-monitor.php?monitorname="+monitorname+"&monitorpos="+monitorpos+"&timeout="+timeout+"&optionPos="+optionPos+"&host="+host,success:function(result){
			 document.getElementById("dvcontentleft").innerHTML=result;
			 loadCameraById();
			 alert("<?=$l_alertinsertsuccessful?>");
			 document.getElementById('newmonitor').setAttribute("class", "inbtnDisable");
			 document.getElementById('newmonitor').className = "inbtnDisable";
			}
		});
	}
}

//content right
function reset_content_right(){
	document.getElementById('postionright').value="";
	all_content_right();
}
function all_content_right(){
	var winH = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;
	$.ajax({url:"search-all-camera-content-right.php?winH="+winH,success:function(result){
		document.getElementById('tablecontentright').innerHTML=result;
		ScrollTable();
	}
	});
}

// choose 1 row in table content right
function chooseRowContentRight(idcamera_right){
	document.getElementById('rowcameraright'+idcamera_right).value=idcamera_right;
	document.getElementById('rowcameraright'+idcamera_right).style.backgroundColor = "#B0CBEF";
	alert('aaa = ' + idcamera_right);
}

// function add camera from configcamera to monitor and favourite
function clickRowTable(els,idcamera_right){
	$('#tablebody tr.select').removeClass('select');
	$(els).addClass('select');
	
	document.getElementById('rowcameraright').value=idcamera_right;
	document.getElementById('chetmay').value=idcamera_right;
}

function addCameraFromRightToLeft(){
	var idcamera=document.getElementById('chetmay').value;
	var idposcamera = document.getElementById('idselectpostioncamera').value;
	var monitorid = document.getElementById('monitorid').value;
	//var page = document.getElementById('idhiddensortpaging').value;
	//alert(' page 2 = ' + page);
	$.ajax({url: "check-exist-favourite.php?monitorid="+monitorid+"&idcamera="+idcamera+"&idposcamera="+idposcamera,success: function(result){
   		//alert(result);
   		document.getElementById('dvidcameraposthidden').innerHTML = result;
		var results = document.getElementById('idcameraposthidden').value;
   		if(results=='no'){
	   		alert("camera id or post already existed");
   		}else{
   			var winH = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;
			$.ajax({url:"insert_favourite.php?monitorid="+monitorid+"&idcamera="+idcamera+"&idposcamera="+idposcamera+"&winH="+winH,success:function(result){
				document.getElementById('table_mo_camera_left').innerHTML = result;
				ScrollTableLeft();
				alert('<?=$l_alertinsertsuccessful?>');
				}
			});
   		}
    }
	});
}

// sort and paging left content monitor
function sortAndPagingLeftMonitor(string,flagDesc,idmonitor){
	//document.getElementById('idhiddensortpaging').value=page;
	//alert('page = ' + page);
	var winH = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;
	$.ajax({url:"sortAndPagingLeftMonitor.php?string="+string+"&flagDesc="+flagDesc+"&idmonitor="+idmonitor+"&winH="+winH,success:function(result){
		document.getElementById('table_mo_camera_left').innerHTML = result;
		ScrollTableLeft();
		}
	});
}

// sort and paging right content monitor
function sortAndPagingRightMonitor(string,flagDesc){
	var search = document.getElementById('postionright').value;
	var winH = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;
	$.ajax({url:"sortAndPagingRightMonitor.php?string="+string+"&flagDesc="+flagDesc+"&search="+search+"&winH="+winH,success:function(result){
		var expr = new RegExp('>[ \t\r\n\v\f]*<', 'g');
		var response_html_fixed = result.replace(expr, '><');
		document.getElementById('tablecontentright').innerHTML = response_html_fixed;
		ScrollTable();
		OnTRCSS();
		}
	});
}
function checkDigistLessThan64(){
	var idselectpostioncamera = Number(document.getElementById('idselectpostioncamera').value);
	if(idselectpostioncamera < 10 && idselectpostioncamera > 01){
		document.getElementById('idselectpostioncamera').value="0"+idselectpostioncamera;
	}else if(idselectpostioncamera == 00 ){
		document.getElementById('idselectpostioncamera').value="01";
	}
	else if(idselectpostioncamera > 64 ){
		document.getElementById('idselectpostioncamera').value="01";
	}
}
function validate(evt)
{
 if(evt.keyCode!=8)
 {
 var theEvent = evt || window.event;
 var key = theEvent.keyCode || theEvent.which;
 key = String.fromCharCode( key );
 var regex = /[0-9]|\./;

 if( !regex.test(key) )
{
   theEvent.returnValue = false;

   if(theEvent.preventDefault) theEvent.preventDefault();

 }
 }
}

function onclickButtonUp(){
	var idselectpostioncamera = (Number(document.getElementById('idselectpostioncamera').value) + 1);
	$.ajax({url:"proccess-button-up-option-camera.php?idselectpostioncamera="+idselectpostioncamera,success:function(result){
		document.getElementById('valueButtonSelectCamera').innerHTML = result;
		}
	});
}
function onclickButtonDown(){
	var idselectpostioncamera = (Number(document.getElementById('idselectpostioncamera').value) - 1);

	$.ajax({url:"proccess-button-up-option-camera.php?idselectpostioncamera="+idselectpostioncamera,success:function(result){
		document.getElementById('valueButtonSelectCamera').innerHTML = result;
		}
	});
}



$(function() {
	$("#idselectpostioncamera").spinner({
	    min : 1,
	    max : 64,
	    showOn : 'both'
	});
	
});

// validate
function validatePos(ele,evt)
{
     if(evt.keyCode!=8)
     {
	     var theEvent = evt || window.event;
	     var key = theEvent.keyCode || theEvent.which;
	     key = String.fromCharCode( key );
	     var regex = /[0-9]/;
		
	     if( !regex.test(key) )
	    {
	       theEvent.returnValue = false;
	
	       if(theEvent.preventDefault) theEvent.preventDefault();
	
	     }else{
	    	 //theEvent.preventDefault();
	    	 OnChangePos(key,ele);
	    	 theEvent.returnValue = false;
	    	 if(theEvent.preventDefault) theEvent.preventDefault();
	     }
     }
}

	//onchange from
	 function OnChangePos(key,ele){
		 var value = $(ele).val()+key;
 		value = parseInt(value);
     	if(value < 00){
     		$(ele).val('64');
     	}else if(value > 64 ){
     		$(ele).val('1');
     	}else{
         	//alert(value);
     		$(ele).val(value);
     	}
    	
	
}

</script>
<script type="text/javascript">
function admin_logout(){
	window.location="../view_logout.php?changepage=admin";
}
function onclickSearch(){
	window.location = "../search/searchcarnums.php?monitor=<?=$monitor?>&monitorname=<?=$monitorname?>";
}
function onclickView(){
	window.location = "../index.php?viewaction=none";
}


function loadpos(){
	var winHf = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;
	$("#divscroll").css("height", parseInt(winHf - 180));
}
function ajaxloadContentMonitorRight(){
	var winH = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;
	$.ajax({url:"ajax_load_content_monitor_right.php?winH="+winH,success:function(result){
		document.getElementById('tablecontentright').innerHTML = result;
		ScrollTable();
		}
	});
}

function loadposLeft(){
	var winHf = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;
	$("#divscrollLeft").css("height", parseInt(winHf - 360));
}

</script>

<?php 
include 'show_function_popup_carcrime.php';
$selectallmonitor = mysql_query("SELECT mn.Name,mn.Monitor_ID FROM monitor mn order by Pos",$connection);

$selectpostmonitor = mysql_query("SELECT adm.value_name FROM adjustment_monitor adm",$connection);
	$list=$_SESSION['sort'];
	$str=$_GET['str'];
	$_SESSION['sortn']=$str;
	$flagDesc=$_GET['flagDesc'];
	
	if(!isset($_REQUEST['page'])){
		$list["cf.id"]="DESC";
		$list["cf.name"]="DESC";

		$str="cf.id";
		
		$_SESSION['sortn']=$str;
		$_SESSION['sort']=$list;
	}else{
		$str=$_SESSION['sortn'];
		$list=$_SESSION['sort'];
	}
	
	$sql1 = "SELECT cf.id,cf.`name` FROM `configcamera` cf";
//	$selectallcamenra = mysql_query($sql1." ORDER BY ".$str." ".$list[$str],$connection);
	$_SESSION['sort']=$list;
	
	
?>
</head>

<body onresize="MyResize();MyResizeLeft();" onload="loadpos();loadposLeft();ajaxloadContentMonitorRight();load_popup_carCrime();loadCameraById();">
<p id="maylya" ><input type="hidden"  id="mayly" name="mayly" /></p>

<div id="dvidcameraposthidden" style="display: none;"><input type="hidden" id="idcameraposthidden"></div>
   <div id="menu" style="text-align: center;">
    	<ul class="amenu">
        	<li><a onclick="onclickSearch();"><input class="csssearch" type="button"/> </a></li>
        	<?php if (isset($_SESSION['role'])){ if ($_SESSION['role']=="Admin"){?>
          		  <li style="background:#1e7bbd"><a href=""><input class="cssadminchoose" type="button"/></a></li>
            <?php }else{} }?>
            <?php $_SESSION['monitor_menu'] = $monitor;?>
            <li style="width:215px"><a onclick="onclickView();"><input class="cssview" type="button"/></a>
            	<select class="seltopadmin"  disabled="disabled">
            		<option><?php echo $monitorname;?></option>
            	</select>
            </li>
            <li><a onclick="admin_logout()" style="cursor:pointer" ><input class="csslogout" type="button"/></a></li>
        </ul>
         <div class="clear"></div>
    </div>
   <div id="submenu">
    	<ul class="asubmenu">
        	<li><a href="#" style="background:#034776; border-radius:6px"><?=$l_monitor?></a></li>
            <li><a href="camera/content-camera-admin.php?monitor=<?=$monitor?>&monitorname=<?=$monitorname?>"><?=$l_camera ?></a></li>
         	<li><a href="car-crime-input-by-user/car-crime-input-by-user-admin.php?monitor=<?=$monitor?>&monitorname=<?=$monitorname?>"><?=$l_carcrimeuser ?></a></li>
            <li><a href="car-crime/content-car-crime-admin.php?monitor=<?=$monitor?>&monitorname=<?=$monitorname?>"><?=$l_carcrime ?></a></li>
            <li><a href="PC/content-PC-admin.php?monitor=<?=$monitor?>&monitorname=<?=$monitorname?>">PC</a></li>
            <li><a href="user/content-user-admin.php?monitor=<?=$monitor?>&monitorname=<?=$monitorname?>"><?=$l_user ?></a></li>
        </ul>
        <div class="clear"></div>
    </div>
    <div class="main">
    	<div style="float:left; width:55%;min-width:624px;" id="dvcontentleft">
            <table cellpadding="0" cellspacing="0" border="0" width="80%" class="tbm1"  id="detailmonitor">
                <tr>
                    <td><?=$l_monitorname ?></td>
                    <td><input type="text" class="intext" style="width:270px;padding-left: 5px;line-height: 26px;" id="monitorname" name="monitorname"/></td>
                    <td><input type="button" class="inbtn" style="width: 65px;" value="<?=$l_new?>" id="newmonitor" name="newmonitor" onclick="create_monitor();"/></td>
                </tr>
                <tr>
                    <td><?=$l_pos ?></td>
                  <td><input type="text" class="intext" style="width:80px;padding-left: 5px;line-height: 26px;" id="monitorpos" name="monitorpos"/></td>
                    <td><input type="button" class="inbtn" style="width: 65px;"  value="<?=$l_edit?>" id="editmonitor" name="editmonitor" 
                    onclick="edit_monitor();"/></td>
                </tr>
                <tr>
                    <td><?=$l_timeout ?></td>
                    <td><input type="text" class="intext" style="width:100px;padding-left: 5px;line-height: 26px;" id="timeout" name="timeout"/>
                     	 <?=$l_rateMonitor ?> 
                        <select style="width:70px" class="seltop" size="1" id="optionPos" name="optionPos">
                        <?php while ($rowpost = mysql_fetch_array($selectpostmonitor)){?>
                      	  <option value="<?=$rowpost[value_name]?>" id="<?=$rowpost[value_name]?>" selected="selected">
                      	  <?=(($rowpost[value_name]+1)*($rowpost[value_name]+1))?></option>
                        <?php }?>
                        </select>
                      </td>
                    <td><input type="button" class="inbtn" style="width: 65px;"  value="<?=$l_delete?>" name="deletemonitor" id="deletemonitor" 
                    onclick="if(confirm('<?=$l_areyousure?>')){ delete_monitor();return true;}else{return false;}" /></td>
                </tr>
                <tr>
                	<td><?=$l_server?></td>
                	<td><input type="text" class="intext" style="width:270px;padding-left: 5px;line-height: 26px;text-align: left;" id="txthost" name="txthost"/></td>
                	<td><input type="button" class="inbtn" style="width: 65px;"  value="<?=$l_reset?>" onclick="reset_1_Monitor();" id="resetmonitor" name="resetmonitor"/></td>
                </tr>
                <tr>
                    <td><?=$l_monitor?></td>
                    <td>
                    	<select  class="seltop" style="vertical-align:middle;width: 270px;" size="1" name="monitorid" id="monitorid" onchange="loadCameraById();">
							<?php while ($rowmonitor = mysql_fetch_array($selectallmonitor)){?>
							<option value="<?=$rowmonitor[Monitor_ID]?>" id="<?=$rowmonitor[Monitor_ID]?>"><?php echo $rowmonitor[Name]?></option>
							<?php }?>
						</select>
                    </td>
                </tr>
            </table>
            <div  id="idtablecamera" >
	            <form id="mpform" name="mpform">
					<div style="color: white; margin-top: 20px;cursor: default;">
						<input type="checkbox" id="checkall" name="checkall"  onclick="checkSelectAll();"/><?=$l_selectall ?>
					</div>
					
					<div class="divtheader">
		            	<table cellpadding="0" cellspacing="0" border="0" width="100%" class="tbchung" id="tablebody2left">
			            	<thead>
			                    <tr>
				                    <th style="width: 8%;"><input type="button" class="indelete" value="<?=$l_delete ?>" name="deleteCamera" onclick="if(confirm('<?=$l_areyousure?>')){ processdeleteCamera(<?=$monitorid?>);return true;}else{return false;}" /></th>
									<th style="width: 5%;">No</th>
									<th style="width: 18%"><a onclick="sortAndPagingLeftMonitor('fa.camera_ID',1,<?=$monitorid?>)" style="cursor: pointer;color: #027acc"><?=$l_cameraid ?></a></th>
									<th style="width: 39%"><a onclick="sortAndPagingLeftMonitor('confc.name',1,<?=$monitorid?>)" style="cursor: pointer;color: #027acc"><?=$l_cameraname ?></a></th>
									<th style="width: 15%"><a onclick="sortAndPagingLeftMonitor('fa.pos',1,<?=$monitorid?>)" style="cursor: pointer;color: #027acc"><?=$l_pos ?></a></th>
									<th class="last" style="width: 15%;border-right: none !important;">&nbsp;</th>               
			                	</tr>
			                </thead>
		            	</table>
	            	</div>
				<div id="table_mo_camera_left">
					<div id="divscrollLeft" style="overflow:scroll;overflow-x: hidden; width:100%; background-color: #ffffff">
			 			<table cellpadding="0" cellspacing="0" border="0" width="100%" class="tbchung" id="tablebodyleft">
			                <tbody>
							</tbody>
			            </table>
			        </div>
	            </div>
	            
	            	<input type="hidden" id="idmonitor" name="idmonitor" value="<?=$monitorid?>">
	            	<input type="hidden" id="pagehidden" name="pagehidden" value="" />
	  			</form>
           </div>
        </div>
        <div style="float:left; padding:300px 20px 0">
        	<input type="button" class="btmove" value="<?php echo "<<"?>" onclick="addCameraFromRightToLeft();" /><br />
        	<div id="valueButtonSelectCamera">
        	<input type="text" class="intext" style="width:25px" id="idselectpostioncamera" name="idselectpostioncamera"  size="2" maxlength="2" 
	            		onkeypress="return validatePos(this,event);" value="01"/>
	                	
	                	</div>
        </div>
        <div style="float:left; width:36%">
        	<p class="arsearch"><?=$l_cameraname ?>
        	<input type="text" style="width:200px;text-align: left;padding-left: 5px;" class="intext" id="postionright" name="postionright"/>
        	<input type="button" value="<?=$l_search ?>" class="inbtn" style="width: 65px;"  onclick="sortAndPagingRightMonitor('<?=$str?>',1);" />
        	<input type="button" value="<?=$l_reset ?>" class="inbtn"  style="width: 65px;" onclick="reset_content_right();"/></p>
            <div style="height: 4px;"></div>
           
            <div class="divtheader">
            	<table cellpadding="0" cellspacing="0" border="0" width="100%" class="tbchung" id="tablebody2">
	                <thead>
	                    <tr>
	                    	<th style="width: 10%">No</th>
	                        <th style="width: 15%"><a onclick="sortAndPagingRightMonitor('cf.id',1)" style="cursor: pointer;color: #027acc"><?=$l_cameraid ?></a></th>
	                        <th class="last" style="width: 75%"><a onclick="sortAndPagingRightMonitor('cf.name',1)" style="cursor: pointer;color: #027acc"><?=$l_cameraname ?></a></th>                    
	                    </tr>
	                </thead>
                </table>
            </div>
            <div id="tablecontentright">
                <div id="divscroll" style="overflow:scroll;overflow-x: hidden; width:100%; background-color: #ffffff">
	                <table  class="tbchung1"  cellpadding="0" cellspacing="0" border="0" width="100%" style="margin-top:0" id="tablebody">
		                 <tbody>
		                   
	                    </tbody>
	                </table>
                </div>
              </div>
            </div>
        </div>
    <input type="hidden" id="chetmay" name="chetmay" value="" />
     <?php include 'show_content_popup_carcrime.php';?>
</body>     
</html>
 <?php mysql_close($connection);?>